<template>
    <div class="app-container">
        <el-form v-show="show" :inline="true" :model="formInline" class="demo-form-inline">
            <el-form-item>
                <el-input v-model="formInline.search" placeholder="请输入姓名" />
            </el-form-item>
            <el-form-item>
                <el-input v-model="formInline.mobile" placeholder="请输入手机号" />
            </el-form-item>
            <el-form-item>
                <el-input v-model="formInline.jobNumber" placeholder="请输入工号" />
            </el-form-item>
            <el-form-item>
                <el-input v-model="formInline.idCard" placeholder="请输入证件号" />
            </el-form-item>
            <el-form-item>
                <el-button type="primary" :icon="Search" @click="onSubmit">搜索</el-button>
                <el-button type="primary" icon="Download" @click="exportExcelFormServe">导出报表</el-button>
                <importButton @onImportExcelForm="onImportExcelForm"></importButton>
            </el-form-item>
        </el-form>

        <FunNavigation @addFrom="$router.push({ name: 'staffAdd' })" @showFn="show = !show" @refreshFn="listFn">
        </FunNavigation>

        <el-table border header-cell-class-name="tableBackground" :data="list" stripe style="width: 100%">
            <el-table-column prop="name" label="姓名" />
            <el-table-column prop="jobNumber" label="工号" />
            <el-table-column prop="mobile" label="手机号" />
            <el-table-column prop="department" label="部门" />
            <el-table-column prop="job" label="岗位" />
            <el-table-column prop="position" label="职务" />
            <el-table-column prop="level" label="职级" />
            <el-table-column prop="basicSalary" label="基本薪资" />
            <el-table-column prop="deduction" label="减除费用" />
            <el-table-column width="180" prop="addtime" label="添加时间">
                <template #default="scope">
                    {{ parseTime(new Date(scope.row.createdAt).getTime()) }}
                </template>
            </el-table-column>
            <el-table-column minWidth="180" fixed="right" prop="address" label="操作">
                <template #default="scope">
                    <el-button icon="Edit" @click="$router.push({ name: 'staffAdd', query: { id: scope.row.id } })"
                        type="primary">编辑</el-button>
                    <el-popconfirm @confirm="deleteFn([scope.row.id])" title="删除员工将导致所有关联信息删除，是否删除？">
                        <template #reference>
                            <el-button icon="Delete" type="danger">删除</el-button>
                        </template>
                    </el-popconfirm>
                </template>

            </el-table-column>
        </el-table>
        <div class="pages">
            <el-pagination background v-model:current-page="formInline.page" v-model:page-size="formInline.pageSize"
                layout=" total,sizes, prev, pager, next" :total="total" @size-change="handleSizeChange"
                @current-change="handleCurrentChange" />
        </div>
    </div>
</template>
<script>
export default {
    name: "userList"
}
</script>
<script setup>

import { postAdminstaff, staffDelete, postAdmindeduction, postStaffImportExcel } from '@/api/api';
import FunNavigation from '@/components/funNavigation/funNavigation.vue';
import importButton from '@/components/importButton/importButton.vue';
import { parseTime } from '@/utils';
import { Search, Refresh } from '@element-plus/icons-vue';
import { onMounted, reactive, ref, computed } from 'vue'
import { permission } from '@/hooks/permission';
import { exportExcel } from '@/utils/excel';
onMounted(() => {
    listFn()
})
const show = ref(true)
const formInline = reactive({
    page: 1,
    pageSize: 10,
    search: "",
    account: "",
    jobNumber: "",
    mobile: '',
    idCard: "",
    orderBy: {},
})

const list = ref([])
const total = ref(0)
const handleSizeChange = (val) => {
    formInline.pageSize = val
    listFn()
}

const handleCurrentChange = (val) => {
    formInline.page = val
    listFn()
}


async function listFn() {
    const { data } = await postAdminstaff({
        ...formInline
    })
    list.value = data.list
    total.value = data.total
}

const onSubmit = () => {
    formInline.page = 1
    listFn()
}
async function setImage(e) {
    if (e.target.files.length > 0) {
        const file = e.target.files[0];
        console.log(file)
    }
}
async function importExcelFormServe() {
    const formData = new FormData();
    formData.append('file', file);
    // const { data } = await importExcel(formData)
    // listFn()
}
async function exportList() {
    const { data } = await postAdminstaff({
        ...formInline,
        page: 1,
        pageSize: 10000
    })
    return data.dataList
}
async function deleteFn(id) {
    await staffDelete(id)
    listFn()
}


async function exportExcelFormServe() {
    let list = await exportList()

    let dataList = list.map(item => {
        return {
            username: item.username,
            parentname: item.parentname,
            mobile: item.mobile,
            userTypeName: item.userTypeName,
            levelName: item.levelName,
            availablebalance: item.availablebalance,
            companyName: item.companyName,
            statusName: item.statusName,
            addtime: parseTime(new Date(item.addtime).getTime(), '{y}-{m}-{d}'),
        }
    })
    exportExcel(dataList, '用户列表', 'ExcelUserTitle', 'sheetName');
}
postAdmindeductionFn()
const eductionList = ref([])
async function postAdmindeductionFn() {
    let { data } = await postAdmindeduction({
        status: [1]
    })
    eductionList.value = data
}
async function onImportExcelForm(e) {
    e.map(item => {
        let obj = item['基本信息']
        item['name'] = obj['姓名']
        item['jobNumber'] = obj['工号']
        item['mobile'] = obj['手机号']
        item['jobAttributes'] = obj['岗位属性']
        item['department'] = obj['部门']
        item['job'] = obj['岗位']
        item['position'] = obj['职务']
        item['entryTime'] = obj['入职时间']
        item['leaveTime'] = obj['离职时间']
        item['basicSalary'] = obj['基本薪资']
        item['level'] = obj['职级']
        item['isLeave'] = obj['是否离职']
        item['taxPayer'] = obj['纳税人属性']
        item['deduction'] = obj['减除费用']
        item['idCard'] = obj['证件号']
        item['payee'] = obj['收款人姓名']
        item['bankCard'] = obj['银行卡号']
        item['bankName'] = obj['开户行']
        item['remark'] = obj['备注']
        item['gjjh'] = obj['公积金号']
        let basicSalary = item['basicSalary']
        item.eductionList = eductionList.value.map(item => {
            return {
                name: item.name,
                status: 1,
                amount: basicSalaryFn(basicSalary, item.name)
            }
        })
        delete item['基本信息']
    })
    let data = await postStaffImportExcel(e)
}
function basicSalaryFn(basicSalary, name) {
    if (name == '基本养老保险费') {
        return basicSalary * 0.08
    } else if (name == '基本医疗保险费') {
        return basicSalary * 0.02
    } else if (name == '失业保险费') {
        return basicSalary * 0.005
    } else if (name == '住房公积金') {
        return basicSalary * 0.07
    } else {
        return basicSalary * 0.02
    }
}
</script>

<style>
.tableBackground {
    background: red;
}
</style>
  